<template>
	<div class="bigDiv">
		<div class="topNav">
			<!-- <el-button type="text" icon="el-icon-search" @click="getList">搜索</el-button>
			<el-button type="text" @click="importHandle">导出excel</el-button> -->
		</div>
		<div style="margin: 10px auto 30px 40px;font-size: 30px;color: #004c70;font-weight: bold;">
			各专区在架情况
		</div>
		<!-- <el-table :data="list" border :cell-style="setRowStyle" :header-cell-style="{background:'#daf3ff',height:'70px',color:'#000000',border: '0.3px solid #afe1e1'}" >
			<el-table-column label="" align="center" prop="本年" margin: auto></el-table-column>
			<el-table-column label="集采协同" align="center" prop="countjc" margin: auto></el-table-column>
			<el-table-column label="党群团购" align="center" prop="numcount" margin: auto></el-table-column>
			<el-table-column label="扶贫" align="center" prop="扶贫" margin: auto></el-table-column>
			<el-table-column label="子企业" align="center" prop="子企业" margin: auto></el-table-column>
			
		</el-table> -->
		<table style="table-layout: fixed;">
			<thead>
				<th width="12.5%" style="width:12.5%;"></th>
				<th width="12.5%" style="width:12.5%;">在架商品数量(个)</th>
				<th width="12.5%" style="width:12.5%;">涉及供用商数量(个)</th>
				<th width="12.5%" style="width:12.5%;">涉及叶类数量(个)</th>
				<th width="12.5%" style="width:12.5%;">具备交易条件商品数量(个)</th>
				<th width="12.5%" style="width:12.5%;">本月交易额</th>
				<th width="12.5%" style="width:12.5%;">本年交易额</th>
				<th width="12.5%" style="width:12.5%;">总交易额</th>
			</thead>
			<tr>
				<td style="font-weight:bolder">集采协同专区</td>
				<td v-for="items in list[0]">{{items.countjc}}</td>
			</tr>
			<tr>
				<td style="font-weight:bolder">协议专区</td>
				<td v-for="items in list[1]">{{(items && items != null)?items.countxy:0}}</td>
				<td></td>
			</tr>
			<tr>
				<td style="font-weight:bolder">工业品专区</td>
				<td v-for="items in list[2]">{{(items && items != null)?items.countgyp:0}}</td>
				
				<td></td>
			</tr>
			<tr>
				<td style="font-weight:bolder">办公用品专区</td>
				<td v-for="items in list[3]">{{items.countbg}}</td>
				<td></td>
			</tr>
		</table>
		<!-- <pagination v-show="total > 0" :total="total" @pagination="getList" /> -->
	</div>
</template>

<script>
	import {
		getGoodsSourceCount1
	} from "@/api/leader/hzr";
	export default {
		name: "",
		// 页面数据
		data() {
			return {
				list: [],
				total: 0, // 一共多少条数据
				timeModel: []
			};
		},
		// 初始化
		mounted() {
			this.getDate();
			console.log('60', this.list);
		},
		// 函数集合
		methods: {
			getDate() {
				//本年商品类别销售金额
				getGoodsSourceCount1().then(res => {
					// for (var i = 0; i < res.length; i++) {
					// 	for (var j = 0; j < res[i].length; j++) {
					// 		if(res[i])
					// 	}
					// }
					this.list = res
					console.log('67', this.list);
				})
			},
			setRowStyle({
				row,
				column,
				rowIndex,
				columnIndex
			}) {
				if (columnIndex == 0) {
					return 'background: #f4ffff'
				}
			}

		}
	}
</script>

<style scoped lang='scss'>
	table {
		width: 100%;

		thead {
			background: #c1e1e1;
			height: 50px;
			line-height: 50px;
		}

		td {
			width: 25%;
			background: #dcfffa;
			height: 50px;
			line-height: 50px;
		}
	}
</style>